<template>
  <div class="box">
    <OnlineExamsMobile ref="onLine" v-if="screenSize.width<typeScreen" />
    <OnlineExamsPc ref="onLine" v-else />
  </div>
</template>
<script>
import {mapGetters} from "vuex";
import OnlineExamsMobile from "./onlineExamsMobile.vue";
import OnlineExamsPc from "./onlineExamsPc.vue";

export default {
  data() {
    return {
    };
  },
  components: {
    OnlineExamsMobile,
    OnlineExamsPc,
  },

  computed: {
    ...mapGetters(["screenSize","typeScreen"]),
  },
  //路由守卫
  beforeRouteLeave(to, from, next) {
    // 导航离开该组件的对应路由时调用
    console.log('路由守卫')
    this.$alert('离开当前页面将自动交卷', '通知', {
      confirmButtonText: '确认离开',
      callback: action => {
        if(action=='confirm'){
          console.log('确认离开')
          this.$refs.onLine.subMit(false)
          next()
        }
      }
    });

    // 可以访问组件实例 `this`
  }
}
</script>
<style lang="scss" scoped>
.box{
  height: 100%;
}
</style>
